<%--
  Created by IntelliJ IDEA .
  User: Baggio
  Date: 2017-11-13
  Time: 18:18
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <meta charset="UTF-8">
    <title>先锋号</title>
    <%@ include file="/common/include-core.jsp" %>
    <%@ include file="/common/include-web.jsp" %>
    <link rel="stylesheet" href="/static/css/web/pioneer/swiper-3.4.2.min.css">
    <link rel="stylesheet" type="text/css" href="/static/css/web/pioneer/index.css">
    <script src="/static/js/web/pioneer/swiper.min.js"></script>
    <script type="text/javascript" src="/static/js/web/pioneer/index/index.js"></script>


</head>
<body>
<%--头部--%>
<jsp:include page="${ctx}/pioneer/head.html"/>

<div class="content">


    <%--banner和右边图片--%>
    <div class="banner">
        <div class="banner_box1">
            <div class="swiper-container">
                <div class="swiper-wrapper">
                    <c:forEach items="${advertBannerList}" var="item">
                    <div class="swiper-slide"><a href="${item.url}"><img src="${picPath}/${item.picUrl}" alt=""></a></div>
                    </c:forEach>
                    <%--<div class="swiper-slide"><img src="/static/images/web/pioneer/index/u128.png" alt=""></div>
                    <div class="swiper-slide"><img src="/static/images/web/pioneer/index/u283.png" alt=""></div>
                    <div class="swiper-slide"><img src="/static/images/web/pioneer/index/u33.png" alt=""></div>--%>
                </div>
                <div class="swiper-pagination"></div>
                <div class="swiper-button-prev"></div>
                <div class="swiper-button-next"></div>
                <%--<div class="slides-thumbnail-backdrop-left"></div>
                <div class="slides-thumbnail-backdrop-right"></div>--%>
            </div>
        </div>
        <div class="right_box">
<c:forEach items="${advertBannerRightList}" var="item">
            <div class="box_p">
                <div><img src="${picPath}/${item.picUrl}" alt=""></div>
                <div class="title_01"><span>${item.title}</span></div>
                <div class="hide_box">
                    <a href="${item.url}">
                        <div class="cont_tt">
                            <h3>${item.title}</h3>

                            <div class="separate_01"></div>
                            <h5>MORE+</h5>
                        </div>
                    </a>
                </div>
            </div>
</c:forEach>
        </div>
    </div>
    <%--banner完--%>



        <%--少先队动态+少先队知识--%>
    <div class="box2">
        <%--少先队动态--%>
        <div class="dynamic_box">
            <div class="title_02">
                <span>少先队动态</span>
                <a href="/pioneer/news/newsList.html?newsType=1" class="more">more+</a>
            </div>
            <div class="dynamic">
                <div class="left_box">
                    <a href="${redSscarfDynamic[0].url}">
                    <div class="box_01">
                        <img src="${picPath}/${redSscarfDynamic[0].picUrl}" alt="">
                        <h5>${redSscarfDynamic[0].title}</h5>
                    </div>
                    </a>
                    <div class="box_bb">
                        <a href="${redSscarfDynamic[1].url}">
                        <div class="box_02 box_l">
                            <img src="${picPath}/${redSscarfDynamic[1].picUrl}" alt="">
                            <span>${redSscarfDynamic[1].title}</span>
                        </div>
                        </a>
                        <a href="${redSscarfDynamic[2].url}">
                        <div class="box_03 box_l">
                            <img src="${picPath}/${redSscarfDynamic[2].picUrl}" alt="">
                            <span>${redSscarfDynamic[2].title}</span>
                        </div>
                        </a>
                    </div>
                </div>
                <div class="right_box">
                    <ul class="ul_1">

<c:forEach items="${news_1List}" var="item" begin="0" end="7">
    <li><a href="/pioneer/news/news.html?tid=${item.tid}"><span title="${item.title}">${item.title}</span></a></li>

</c:forEach>
                    </ul>
                    <%--<ul class="ul_2">
                        <li><a href=""><span>中兴要求全体员工重学欧美法律 合规考试满分才..</span></a></li>
                        <li>福布斯：硬件软件齐断货 中兴将在数周内破产</li>
                        <li>亟待攻克的核心技术 中兴的“芯”病 中国的心病</li>
                        <li>MySQL 8正式版8.0.11发布：比MySQL 5.7快2倍</li>
                        <li>亟待攻克的核心技术 中兴的“芯”病 中国的心病</li>
                        <li>福布斯：硬件软件齐断货 中兴将在数周内破产</li>
                        <li>亟待攻克的核心技术 中兴的“芯”病 中国的心病</li>
                        <li>MySQL 8正式版8.0.11发布：比MySQL 5.7快2倍</li>

                    </ul>--%>
                </div>
            </div>
        </div>


        <%--少先队知识--%>
        <div class="knowledge_box">
            <div class="title_03">
                <span>少先队知识</span>
                <a href="/pioneer/news/newsList.html?newsType=2" class="more">more+</a>
            </div>
            <div class="knowledge_cont">
                <div class="img_b">
                    <a href="${redSscarfKnowledge[0].url}">
                        <img src="${picPath}/${redSscarfKnowledge[0].picUrl}" alt="">
                        <div class="title_04" title="" >${redSscarfKnowledge[0].title}</div>
                    </a>
                </div>
                <div class="img_b2">
                    <ul>
<c:forEach items="${redSscarfKnowledge}" var="item" begin="1" end="3">
                        <li>
                            <a href="${item.url}">
                                <div class="img_o"><img src="${picPath}/${item.picUrl}" alt=""></div>
                                <div class="img_cott">${item.title}</div>
                            </a>
                        </li>
</c:forEach>
                    </ul>
                </div>
            </div>
        </div>
    </div>



    <%--智慧队课+五彩校园--%>
    <div class="box3">

        <%--智慧队课--%>
        <div class="wisdom_box">
            <div class="title_02">
                <span>智慧队课</span>
                <a href="/pioneer/media/index.html?type=1" class="more">more+</a>
            </div>
            <div class="wisdom">
                <ul>
                    <c:forEach items="${teamWisdomLessons}" var="item">

                        <li>
                            <a href="${item.url}">
                                <div>
                                    <img src="${picPath}/${item.picUrl}" alt="">
                                </div>
                               <%-- <span class="timer">01:45</span>--%>
                                <h3>${item.title}</h3>
                            </a>
                        </li>
                    </c:forEach>


                </ul>
            </div>


        </div>


        <%--五彩校园--%>
        <div class="colourful_box">
            <div class="title_03">
                <span>五彩校园</span>
                <a href="/pioneer/news/newsList.html?newsType=3" class="more">more+</a>
            </div>
            <div class="colourful">
                <c:forEach items="${colorfulShcool}" var="item" begin="0" end="2">


                    <a href="${item.url}">
                        <div class="colourful_01">
                            <img src="${picPath}/${item.picUrl}" alt="">
                            <div class="title_04">${item.title}</div>
                        </div>
                    </a>

                </c:forEach>



            </div>
        </div>
    </div>



    <%--红领巾电视台和红领巾小提案--%>
    <div class="box4">
        <div class="red_scarf_station_box">
            <div class="title_02" style="padding-left: 50px;">
                <span>红领巾电台</span>
                <a href="/pioneer/media/index.html?type=2" class="more">more+</a>
            </div>
            <div class="red_scarf_station">
                <ul>


                    <c:forEach items="${media_2List}" var="item" begin="0" end="11">

                        <li>
                            <a href="/pioneer/media/playVoice.html?tid=${item.tid}">
                                <div class="station_01">
                                    <img src="${picPath}/${item.mediaPic}" alt="" class="img_001">
                                    <div class="station_02">
                                        <span class="span1"><img src="/static/images/web/pioneer/index/u175.png" alt=""></span>
                                        <%--<span class="quantity">${item.amount}收听量</span>--%>
                                    </div>
                                </div>
                                <div class="title_h5">${item.mediaName}</div>
                            </a>
                        </li>
                    </c:forEach>


                </ul>
            </div>
        </div>
        <%--<div class="red_scarf_proposal_box">
            <div class="title_03">
                <span>红领巾小提案</span>
                <a href="/pioneer/messageBoard/messageBoardList.html" class="more">more+</a>
            </div>
            <div class="red_scarf_proposal">
                <ul>
<c:forEach items="${messageBoardList}" var="item" begin="0" end="10">
                    <li>
                        <a href="/pioneer/messageBoard/messageBoardList.html">
                            <div class="img_box"><img src="${item.headPic}" alt=""></div>
                            <div class="rh_box">
                                <h5>${item.userName}</h5>
                                <p>${item.message}</p>
                            </div>
                        </a>
                    </li>
</c:forEach>
                </ul>
            </div>
        </div>--%>
    </div>





</div>
<%--页脚--%>
<jsp:include page="${ctx}/pioneer/foot.html"/>
</body>
</html>
